<template>
    <div>
      <van-row type="flex" justify="space-between" class="title">
        <van-col class="cancel" @click="cencel">取消</van-col>
        <van-col class="sure" @click="saveInfo">确定</van-col>
      </van-row>
  
      <van-cell-group>
        <van-field v-model="editInfo.userName" label="姓名" placeholder="请输入用户名" />
        <van-field v-model="editInfo.school" label="学校" placeholder="请输入学校名" />
        <van-field v-model="editInfo.studentId" label="学号" placeholder="请输入学号" />
        <van-field v-model="editInfo.college" label="学院" placeholder="请输入学院" />
        <van-field v-model="editInfo.major" label="专业" placeholder="请输入专业" />
        <van-field v-model="editInfo.phone" label="电话" placeholder="请输入电话" />
      </van-cell-group>
    </div>
  </template>
  
  <script>
  import {mapState, mapActions} from 'vuex'
  import { updatauser } from '@/axios'
  export default {
    data() {
      return {
        editInfo: {
          userName: '',
          school: '',
          studentId: '',
          college: '',
          major: '',
          phone: '',
        }
      }
    },
    computed: {
      ...mapState(['user'])
    },
    mounted() {
      this.editInfo = Object.assign({}, this.user)
    },
    methods: {
      ...mapActions(['saveuserInfoAction']),
      cencel() {
        this.$emit('close', false)
        this.editInfo = Object.assign({}, this.user)
      },
      saveInfo(){
        updatauser(this.editInfo).then(res =>{
            console.log(res);
            this.$toast.success(res.msg)
            this.saveuserInfoAction(this.editInfo)
            this.$emit('close', false)
        })
      }
    }
  }
  </script>
  
  <style lang="less" scoped>
  .title{
    padding: 10px 10px;
    .cancel{
      color: #999;
    }
    .sure{
      color: #1989fa;
    }
  }
  </style>